/**
 *
 * @Description TODO
 * @Author liuer
 * @CreateTime 2023年12月19日 11:20
 */

import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:yt_devops/components/gaps.dart';
import 'package:yt_devops/components/yt_text_style.dart';
import 'package:yt_devops/styles/styles.dart';

/* 折叠卡片 */
class TreeExpansionCard extends StatefulWidget {
  final String title;
  final Function(bool)? callBack; // 点击标题的回调
  final List<Widget>? contentWidget; // 折叠内容
  bool isSelected;
  final double marginLeft;
  TreeExpansionCard(
      {Key? key,

        required this.title,
        required this.contentWidget,
        required this.isSelected,
        this.marginLeft = 32,
        this.callBack,})
      : super(key: key);

  @override
  _TreeExpansionCardState createState() => _TreeExpansionCardState();
}

class _TreeExpansionCardState extends State<TreeExpansionCard> {
  bool _isExpanded = false;
  @override
  void initState() {
    // TODO: implement initState
    super.initState();

  }

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: const BoxDecoration(
        color: Colour.backgroundColor,

        borderRadius: BorderRadius.all(Radius.circular(6)),
      ),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        mainAxisAlignment: MainAxisAlignment.start,
        children: <Widget>[
          GestureDetector(
            onTap: () {
              _isExpanded = !_isExpanded;
              if (mounted) {
                setState(() {});
              }

            },
            child: Container(
              height: 40,
              color: Colors.white,
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: <Widget>[
                  SizedBox(width: widget.marginLeft),
                  GestureDetector(
                    child: Container(
                      padding: const EdgeInsets.only(
                          left: 16, top: 14, bottom: 14),
                      child: Image.asset(
                        _isExpanded
                            ?'assets/images/site_observer_down_arrow.png':'assets/images/site_observer_right_arrow.png',
                        height: 16,
                        width: 16,
                        fit: BoxFit.cover,
                        // color: widget.status == 2?Colours.redFF7F74Color:Colours.green8EFB7DColor,
                      ),
                    ),
                  ),
                  Container(
                    alignment: Alignment.center,
                    child: Text(
                      widget.title,
                      style: ytTextStyle(
                          fontSize: 14,
                          height: 1.1,
                          fontWeight: FontWeight.normal),
                    ),
                  ),
                  Gaps.hGap8,

                  Spacer(),
                  Container(
                    padding: const EdgeInsets.only(right: 6),
                    child: IconButton(
                      iconSize: 20,
                      icon:
                      widget.isSelected
                          ? const Icon(
                        Icons.check_circle,
                        color: Colour.primaryColor,
                      ):
                      const Icon(
                        Icons.circle_outlined,
                        color: Colour.diabledButtoBgColor,
                      ),
                      onPressed: () {
                        setState(() {
                          widget.isSelected = !widget.isSelected;
                        });
                       if(widget.callBack !=null){
                         widget.callBack!(widget.isSelected);
                       }
                      },
                    ),
                  ),
                  Gaps.hGap8,

                ],
              ),
            ),
          ),
          Container(
            alignment: Alignment.centerLeft,
            // color: Colors.red,
            child: ExpansionCustom(
              initiallyExpanded: false,
              isExpanded: _isExpanded,
              padding: EdgeInsets.zero,
              children: <Widget>[
                Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  mainAxisAlignment: MainAxisAlignment.start,
                  children: widget.contentWidget ?? [Container()],
                )
              ],
            ),
          )
        ],
      ),
    );
  }
}

const Duration _kExpand = Duration(milliseconds: 200);

/* 折叠组件 */
class ExpansionCustom extends StatefulWidget {
  const ExpansionCustom({
    Key? key,
    this.title,
    this.onExpansionChanged,
    this.children = const <Widget>[],
    this.initiallyExpanded = false,
    this.isExpanded = false,
    this.padding,
  })  : assert(initiallyExpanded != null),
        super(key: key);

  final Widget? title;
  final ValueChanged<bool>? onExpansionChanged;
  final List<Widget>? children;
  final bool? initiallyExpanded;
  final bool? isExpanded;
  final EdgeInsetsGeometry? padding;

  @override
  _ExpansionCustomState createState() => _ExpansionCustomState();
}

class _ExpansionCustomState extends State<ExpansionCustom>
    with SingleTickerProviderStateMixin {
  static final Animatable<double> _easeInTween =
  CurveTween(curve: Curves.easeIn);

  late AnimationController _controller;
  late Animation<double> _heightFactor;

  bool _isExpanded = false;

  @override
  void initState() {
    super.initState();
    _controller = AnimationController(duration: _kExpand, vsync: this);
    _heightFactor = _controller.drive(_easeInTween);

    _isExpanded =
        PageStorage.of(context).readState(context) ?? widget.initiallyExpanded;
    if (_isExpanded) _controller.value = 1.0;
  }

  diyHandle() {
    if (widget.isExpanded != null) {
      setState(() {
        if (widget.isExpanded != null && widget.isExpanded!) {
          _controller.forward();
        } else {
          _controller.reverse().then<void>((void value) {
            if (!mounted) return;
            setState(() {});
          });
        }
      });
    }
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  void _handleTap() {
    setState(() {
      _isExpanded = !_isExpanded;
      if (_isExpanded) {
        _controller.forward();
      } else {
        _controller.reverse().then<void>((void value) {
          if (!mounted) return;
          setState(() {});
        });
      }
      PageStorage.of(context).writeState(context, _isExpanded);
    });
    if (widget.onExpansionChanged != null) {
      widget.onExpansionChanged!(_isExpanded);
    }
  }

  Widget _buildChildren(BuildContext context, Widget? child) {
    return Column(
      mainAxisSize: MainAxisSize.min,
      crossAxisAlignment: CrossAxisAlignment.start,
      mainAxisAlignment: MainAxisAlignment.start,
      children: <Widget>[
        GestureDetector(
          onTap: _handleTap,
          child: Container(
            color: Colors.white,
            width: double.infinity,
            padding: widget.padding ?? const EdgeInsets.only(left: 10, right: 10),
            child: widget.title ?? Container(),
          ),
        ),
        ClipRect(
          child: Align(
            heightFactor: _heightFactor.value,
            child: child,
          ),
        ),
      ],
    );
  }

  @override
  Widget build(BuildContext context) {
    diyHandle();
    final bool closed = !_isExpanded && _controller.isDismissed;
    return AnimatedBuilder(
      animation: _controller.view,
      builder: _buildChildren,
      child: closed ? null : Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          mainAxisAlignment: MainAxisAlignment.start,
          children: widget.children!),
    );
  }
}
